<template>
  <div>
    <p class="name">
      <i class="el-icon-setting" @click="$emit('clickSetting')"></i>{{title}}
    </p>
    <div class="right">
      <!-- <i v-if="chartsType && isCharts" @click="$emit('changeType')" :class="chartsType === '0'?'el-icon-s-marketing':'el-icon-s-grid'"></i> -->
      <i
        v-if="isCharts"
        @click="label.show = label.show?false:true"
        :class="label.show?'el-icon-s-fold':'el-icon-s-unfold'"
      ></i>
      <i :class="isCharts?'el-icon-s-data':'el-icon-menu'" @click="$emit('changeCharts')"></i>
    </div>
  </div>
</template>
<script>
export default {
  props: {
    title:{
      type:String
    },
    label: {
      type: Object
    },
    isCharts: {
      type: Boolean,
      default: true
    },
    // chartsType:{
    //   type:String,
    //   default:false
    // }
  }
};
</script>
<style lang="scss" scoped>
.name {
  margin: 0;
  padding: 0;
  font-size: 14px;
  color: #333333;
  i {
    margin-right: 5px;
    color: #409eff;
    font-weight: bold;
    cursor: pointer;
  }
}

.right {
  position: absolute;
  right: 10px;
  top: 15px;
  i {
    cursor: pointer;
    color: #333333;
  }
}
</style>